/**
 *@auther: tang
 *@Date: 2020-11-10
 *Project: group-booking-shop-manage-system
 */
//路由权限控制
import React, { Component } from "react";
import { Route, Redirect } from "react-router-dom";
import loadable from "@loadable/component";
import getOneConsArr from "./util/oneConsArr";
import routerMap from "./routerMap";
import NoFoundPage from "./pages/NoFoundPage";
import {Observer,inject} from "mobx-react"
import Nprogress from "nprogress"
@inject("userStore","permissStore")
@Observer
class FrontendAuth extends Component {
    // eslint-disable-next-line no-useless-constructor
    constructor(props) {
        super(props);
    }
    bindRouter(list){
        let routerList= list.map((item)=>{
            // console.log(item)
            ////判断是否有子判断
                if(item.menuChilds.length===0){//无子菜单
                    return  <Route key={item.menuId} exact path={item.menuUrl} component={ loadable(() => import(`./pages/${item.componentPath}`))}/>
                }else{
                    //有子菜单
                    //判断是否包含子组件
                    if(item.isContainChildren){ //嵌套在父级中，记得在在父组件中，添加 {this.props.children}在要嵌套的位置
                        return  <Route key={item.menuId} path={item.menuUrl} render={() =>{
                            let ComponentName =loadable(() => import(`./pages/${item.componentPath}`));
                            return <ComponentName {...this.props}>
                                {this.bindRouter(item.menuChilds)}
                            </ComponentName>
                        }}>
                        </Route>
                    }else{ //不嵌套显示
                        return [...this.bindRouter(item.menuChilds),<Route exact key={item.menuId} path={item.menuUrl} component={ loadable(() => import(`./pages/${item.componentPath}`))}/>]
                    }
                }
        })
        // console.log(routerList)
        return [...routerList];
    }
    render() {
        Nprogress.start();
        const { routerConfig, location } = this.props;
        let {userStore}  = this.props;
        const { pathname } = location;
        let basicRoute = routerMap.find(item=>{
            return item.path===pathname
        })
        //拿到首页
        // console.log(routerConfig)
        let homeRoute = (getOneConsArr([...routerConfig])).find(
            (item) => {
                // console.log(item.path,item.menuUrl,(item.path&&item.path === pathname) || (item.menuUrl&&item.menuUrl===pathname))
                return item.default && item.default===true
            }
        );
         // console.log(pathname,homeRoute);
        // console.log("路由校验",routerConfig)
        const isLogin = userStore.userInfo;
        // 如果该路由不用进行权限校验，登录状态下登陆页除外
        // 因为登陆后，无法跳转到登陆页
        // 这部分代码，是为了在非登陆状态下，访问不需要权限校验的路由
        const targetRouterConfig = (getOneConsArr([...routerConfig])).find(
            (item) => {
                // console.log(item.path,item.menuUrl,(item.path&&item.path === pathname) || (item.menuUrl&&item.menuUrl===pathname))
                return ((item.path === pathname) || (item.menuUrl===pathname))
            }
        );
        // console.log( getOneConsArr([...routerConfig]),targetRouterConfig)
        if (targetRouterConfig && !targetRouterConfig.auth && !isLogin && targetRouterConfig.name) {
            const { component } = targetRouterConfig;
            return <Route key={targetRouterConfig.menuId} path={pathname} component={component} />;
        }else if(targetRouterConfig && !targetRouterConfig.auth && !isLogin && targetRouterConfig.pathname){
            return <Route key={targetRouterConfig.menuId} path={targetRouterConfig.menuUrl} component={loadable(() => import(`./pages/${targetRouterConfig.componentPath}`))}/>
        }
        if (isLogin) {
            Nprogress.done()
            // 如果是登陆状态，想要跳转到登陆，重定向到主页
            if (pathname === "/login" || pathname==="/") {
                return <Redirect to="/index" />;
            } else {
                // 如果路由合法，就跳转到相应的路由
                if (targetRouterConfig && targetRouterConfig.menuChilds) {
                    // console.log(this.bindRouter(routerConfig))
                    return (
                        this.bindRouter(routerConfig)
                    );
                } else if (targetRouterConfig && targetRouterConfig.name) {
                    const {component} = targetRouterConfig;
                    return [<Route key={targetRouterConfig.menuId} path={pathname} component={component}/>];
                } else if (targetRouterConfig && targetRouterConfig.pathname) {
                    return [<Route key={targetRouterConfig.menuId} path={targetRouterConfig.menuUrl}
                                  component={targetRouterConfig.pathname}/>]
                } else if (!targetRouterConfig && !basicRoute){
                    // 如果路由不合法，重定向到 404 页面
                    console.log(this.props)

                    if (this.props.permissStore.routeNotFound){
                        return <Redirect to="/404"/>;
                    }else{
                        return <></>
                    }

                }else if (pathname==="/index" &&!targetRouterConfig && basicRoute){
                    //    如果不需要操作，就定向到默认的首页路由
                    //  console.log("心态崩了",targetRouterConfig,homeRoute)
                    return <Route path={homeRoute.menuUrl}   key={homeRoute.menuId} component={loadable(()=>import(`./pages/${homeRoute.componentPath}`))}/>
                }else{
                    //如果外层路由有，就返回内嵌的404
                    console.log("重定向到404")
                    return [<Route path="/index/" exact component={NoFoundPage} key={`/index/404`}/>]
                }
            }
        } else {
            Nprogress.done()
            // 非登陆状态下，当路由合法时且需要权限校验时，跳转到登陆页面，要求登陆
            if (targetRouterConfig && targetRouterConfig.auth) {
                return <Redirect to="/login" />;
            } else {
                // 非登陆状态下，路由不合法时，重定向至 404
                return <Redirect to="/404" />;
            }
        }
    }
}

export default FrontendAuth;
